<template>
  <el-card style="height: 100%;" :body-style="{height:'100%'}" shadow="hover">
    <div class="pieChart" id="pieChart2"  ref="pieChartRef"/>
  </el-card>
</template>

<script lang="ts" name="pieChart" setup>
import {getOption} from './options'
import {useEcharts} from "@/hooks/useEcharts";


const pieChartRef = ref<HTMLHtmlElement | null>(null)
onMounted(async () => {
  const {echartsInstance,setOption} = useEcharts(pieChartRef)
  setOption(getOption())
})
</script>

<style lang="less" scoped>
.pieChart {
  width: 100%;
  height: 100%;
}
</style>
